<template>
	<view class="addpage">
		<view class="allbox" >
			
		
		<view class="bannerbox">
			<view class="bannertitle">
				创建计划
			</view>
			<view class="line">
				<view class="left">
					标签
				</view>
				<view class="right">
					<input class="uni-input"  style="color: #1A4f8A;" type="text"  v-model="even" />
					<picker class="picker" mode="selector" :value="index"  :range="evenlist"   @change="selecteven">
							<view class="uni-input" ></view>
						</picker>
					<view class="iconfont icon-xiangyou1">
						
					</view>
				</view>
			</view>
			<!-- <view class="line">
				<view class="left">
				计划名称
				</view>
				<view class="right">
					<input type="text" placeholder="请输入" v-model="item.name" />
				</view>
			</view>
			<view class="line">
				<view class="left">
				计划说明
				</view>
				<view class="right">
					<input type="text" placeholder="请输入" v-model="item.content" />
				</view>
			</view> -->

		</view>
		<view class="bannerbox">
			<view class="bannertitle">
				计划内容
			</view>
			<view class="line">
				<view class="left">
				主题
				</view>
				<view class="right">
					<input style="color: #1A4f8A;" type="text" placeholder="请输入" v-model="title" />
				</view>
			</view>
			<view class="line">
				<view class="left">
				说明
				</view>
				<view class="right">
					<input style="color: #1A4f8A;" type="text" placeholder="请输入" v-model="shuoming" />
				</view>
			</view>
			<view class="line">
				<view class="left">
					时间
				</view>
				<view class="right">
					<picker class="picker long " mode="date"  start="2025-09-15" end="2030-09-30" @change="bindTimeChange">
							<view class="uni-input long">{{time}}</view>
						</picker>
					<view class="iconfont icon-xiangyou1">
						
					</view>
				</view>
			</view>
			
			<view class="line zhongjian">
				<view class="left">
					阶段
				</view>
				<view class="right">
					<picker class="picker long" mode="selector" :value="index1"  :range="jieduanlist" range-key="label"   @change="selectjieduan">
							<view class="uni-input long">{{jieduanlist[index1].label}}</view>
						</picker>
					<view class="iconfont icon-xiangyou1">
						
					</view>
				</view>
			</view>
		</view>
		</view>
<!-- 		<view class="iconline" @click="addlist">
			<view class="iconfont icon-tianjia">
				
			</view>
			点击继续添加
		</view> -->
		<view class="btn" @click="addsave">
			保存
		</view>
	</view>
</template>

<script>
	import {addEvent,getDictData} from '../../utils/api.js'
	export default {
		data() {
			return {
				title:'',
				shuoming:'',
				time:'',
				even:'',
				index:'',
			evenlist:[ '吃药','称体重'],
			index1:'',
		     jieduanlist:[
				 {
					 id:0,
					 label:'第一阶段'
				 },
				 {
					 id:1,
					 label:'第二阶段'
				 },
				 {
				 	id:2,
				 	label:'第三阶段'
				 } ,
				 {
					 id:3,
					 label:'第四阶段'
				 },
				 {
				 id:4,
				 label:'第五阶段'
				 },
				 {
				 id:5,
				 label:'第六阶段'
				 }
			 ]
				
			}
		},
		onShow() {
			let p={
				type:'sys_shijiantixingbiaoqian'
			}
			getDictData(p).then(rse=>{
				console.log(res,'查询字典事件标签')
			})
			let a={
				type:'sys_chongfuleixing'
			}
			getDictData(a).then(rse=>{
				console.log(res,'查询字典重复类型标签')
			})
		},
		methods: {
			addsave(){
				let that=this
				uni.showModal({
					title: '提示',
					content: '确定保存事件吗？',
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
							let p={
								memberName:uni.getStorageSync('phone'),
								faType:2,
								faSixxType:that.even,
								faTitle:that.title,
								faContent:that.shuoming,
								faTime:that.time,
								faStage:that.jieduanlist[that.index1].id
							}
							addEvent(p).then(res=>{
								console.log(res)
								if(res.data.code==200){
									uni.showToast({
										title: '添加成功',
										duration: 2000
									});
									uni.navigateBack()
								}else{
									uni.showToast({
										title: res.data.msg,
										icon:'none',
										duration: 2000
									});
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			},
			
			//选择标签事件
			selecteven(e){
				
				this.index=e.detail.value
				this.even=this.evenlist[e.detail.value]
				
			},
			
			//选择阶段
			selectjieduan(e){
				this.index1=e.detail.value
			},
			
			
			//选择时间
			bindTimeChange(e){
				
				this.time=e.detail.value
			},
		}
	}
</script>

<style  lang="less" scoped>
 .addpage{
	 width: 750rpx;
	 background: linear-gradient(180deg, rgba(242,248,255,1) 0%,rgba(255,255,255,0) 76%);
	 box-sizing: border-box;
	 padding: 30rpx;
	 height: 100vh;
	 padding-bottom: 50rpx;
	 
 }
 .allbox{
	 width: 100%;
	 margin-top: 50rpx;
 }
 .bannerbox{
	 width: 100%;
	 background-color: white;
	 box-sizing: border-box;
	 margin-top: 30rpx;
	 border-radius: 20rpx;
	 padding: 20rpx;
 }
 .bannertitle{
	 font-weight: bold;
	 border-left:8rpx solid #1A4F8A;
	 padding-left: 10rpx;
	 height: 40rpx;
	 line-height: 40rpx;
 }
 .line{
	 width: 100%;
	 display: flex;
	 align-items: center;
	 justify-content: space-between;
	 padding: 0 30rpx;
	 height: 120rpx;
	 line-height: 120rpx;
	 font-weight: bold;
	 box-sizing: border-box;
	 border-bottom: 1rpx solid #f1f1f1;
	 
 }
 .uni-input{
	 width: 150rpx;
	 height: 120rpx;
	 text-align: center;
	 color: #1A4f8A;
 }
 .long{
	 width: 400rpx !important;
 }
 .picker{
	 width: 200rpx;
	 height: 120rpx;
	 line-height: 120rpx;
	 color: #1A4f8A;
	 
 }
 .zhongjian{
	 border-top: 1rpx solid #f1f1f1;
	 border-bottom: 1rpx solid #f1f1f1;
 }
 .right{
	 display: flex;
	 width: 400rpx;
	 align-items: center;
	 color: #B1B1B1 ;
	 .picker{
		 width: 200rpx;
		
	 }
	 
 }
 .iconline{
	 display: flex;
	 color: gray;
	 margin: 30rpx auto;
	 justify-content: center;
	 align-items: center;
 }
 .btn{
	 width: 80%;
	 margin: auto;
	 height: 100rpx;
	 border-radius: 30rpx;
	 text-align: center;
	 color: white;
    line-height: 100rpx;
		 background-color: #1A4F8A;
		 margin-top: 100rpx;
		 font-weight: bold;
 }
 
</style>
